<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
  <title>首页</title>
  <style>
    /* 整体页面布局 */
    body {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 20px;
      background-color: #f4f4f4;
    }
    /* 导航栏样式 */
    nav {
      background-color: #333;
      overflow: hidden;
    }
    nav a {
      display: block;
      color: white;
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
    }
    nav a:hover {
      background-color: #ddd;
      color: black;
    }
    /* 表单样式 */
    form {
      background-color: #fff;
      padding: 20px;
      border: 1px solid #ddd;
      border-radius: 5px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      display: flex;
      justify-content: space-between;
      margin-bottom: 20px;
    }
    label {
      margin-right: 10px;
    }
    input[type="text"] {
      padding: 8px;
      border: 1px solid #ddd;
      border-radius: 3px;
    }
    input[type="submit"] {
      background-color: #4CAF50;
      color: white;
      padding: 10px 20px;
      border: none;
      border-radius: 3px;
      cursor: pointer;
    }
    input[type="submit"]:hover {
      background-color: #45a049;
    }
    /* 表格样式 */
    table {
      width: 100%;
      border-collapse: collapse;
      background-color: #fff;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }
    th, td {
      border: 1px solid #ddd;
      padding: 12px;
      text-align: left;
    }
    th {
      background-color: #f2f2f2;
    }
    /* 操作列样式 */
    td span {
      display: inline-block;
      padding: 6px 12px;
      background-color: #007BFF;
      color: white;
      text-decoration: none;
      border-radius: 3px;
    }
    td a {
      display: inline-block;
      padding: 6px 12px;
      background-color: #007BFF;
      color: white;
      text-decoration: none;
      border-radius: 3px;
    }
    td a:hover {
      background-color: #0056b3;
    }
  </style>
</head>
<body>
<nav>
  <a href="login.jsp">首页</a>
  <a href="${pageContext.request.contextPath}/personalCenter">个人中心</a> <a href="${pageContext.request.contextPath}/user/myReservations?userId=${user.userId}">预约记录</a> <!-- 在个人中心旁边添加预约记录链接 -->
  <div style="float: right;"> <!-- 使退出登录链接靠右显示 -->
    <a href="${pageContext.request.contextPath}/user/logout">退出登录</a>
  </div>
</nav>
<form action="${pageContext.request.contextPath}/user/searchClassrooms" method="get">
  <div>
    <label for="classroomName">教室名称:</label>
    <input type="text" id="classroomName" name="classroomName">
  </div>
  <div>
    <label for="capacity">容量:</label>
    <input type="text" id="capacity" name="capacity">
  </div>
  <div>
    <label for="status">状态:</label>
    <input type="text" id="status" name="status">
  </div>
  <div>
    <label for="location">地点:</label>
    <input type="text" id="location" name="location">
  </div>
  <div>
    <label for="description">描述:</label>
    <input type="text" id="description" name="description">
  </div>
  <div>
    <input type="submit" value="查询">
  </div>
</form>
<link rel="stylesheet" href="../../css/classroom.css">
<table border="1px">
  <tr>
    <th>教室名称</th>
    <th>容量</th>
    <th>状态</th>
    <th>地点</th>
    <th>描述</th>
    <th>操作</th>
  </tr>

  <c:forEach var="rooms" items="${classroomList}">
    <tr>
        <%--      <th>${rooms.classroomId}</th>--%>
      <th>${rooms.classroomName}</th>
      <th>${rooms.capacity}</th>
      <th>${rooms.status}</th>
      <th>${rooms.building}</th>
      <th>${rooms.description}</th>
      <td>
        <c:choose>
          <c:when test="${rooms.status == '申请中' || rooms.status == '已预订'}">
            <span href="#" class="disabled" style="background-color: #555555">申请</span>
          </c:when>
          <c:otherwise>
            <a href="${pageContext.request.contextPath}/apply?classroomId=${rooms.classroomId}&userId=${user.userId}">申请</a>
          </c:otherwise>
        </c:choose>
      </td>
    </tr>
  </c:forEach>
</table>
</body>
</html>